<template>
    <div class="credit">
        <van-nav-bar title="申请授信" left-arrow @click-left="onClickLeft" />
        <div class="credit_list">
            <div class="credit_item" v-for="item, index in creditList" :key="index">
                <div class="credit_info">
                    <div class="credit_name"  :style="{ 'color': item.text_color }">{{ item.name }}</div>
                    <div class="credit_money">{{ item.quota }}</div>
                </div>
                <div class="line"></div>
                <div class="container">
                    <div class="credit_btn" v-if="item.status==-1" @click="handleCredit(item.id)">{{ item.status_desc }}</div>
                    <div class="credit_btn" v-if="item.status==0"   @click="handleCredit(item.id)" style="background-color: #FFFBE6; color: #FAAD14;border: 1px solid #FFF1B8;">{{ item.status_desc }}</div>
                    <div class="credit_btn" v-if="item.status==1"   @click="handleCredit(item.id)" style="background-color: #FFF2E6; color: #FF7017;border: 1px solid #FFD0B8;">{{ item.status_desc }}</div>
                    <div class="credit_btn" v-if="item.status==2"   @click="handleCredit(item.id)" style="background-color: #FFF2E6; color: #FF7017;border: 1px solid #FFD0B8;">{{ item.status_desc }}</div>
                    <div class="credit_btn" v-if="item.status==10"  @click="handleCredit(item.id)" style="background-color: #F6FFED; color: #52C41A;border: 1px solid #D9F7BE;">{{ item.status_desc }}</div>
                    <div class="credit_btn" v-if="item.status==11"  @click="handleCredit(item.id)" style="background-color: #F6FFED; color: #52C41A;border: 1px solid #D9F7BE;">{{ item.status_desc }}</div>
                    <!-- <div class="credit_btn" v-if="item.status==12" style="background-color: #F6FFED; color: #52C41A;border: 1px solid #D9F7BE;">签署驳回</div>
                    <div class="credit_btn" v-if="item.status==20" style="background-color: #F6FFED; color: #52C41A;border: 1px solid #D9F7BE;">已提交</div>
                    <div class="credit_btn" v-if="item.status==21" style="background-color: #F6FFED; color: #52C41A;border: 1px solid #D9F7BE;">已完成</div>
                    <div class="credit_btn" v-if="item.status==22" style="background-color: #F6FFED; color: #52C41A;border: 1px solid #D9F7BE;">结业驳回</div> -->
                </div>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {
            creditList: [],
            ids:this.$route.query.id
        }
    },
    created() {
        // this.ids=
        this.getShopDetail()
    },
    methods: {
        getShopDetail() {
			this.$http.get(`/store/manage/${this.ids}/credit_configs`)
				.then(res => {
                    this.creditList=res.data
				})
		},
        onClickLeft() {
            this.$router.push('/shopSettleList')
        },
        //立即申请
        handleCredit(id){
            this.$router.push({path:'/creditSign',query:{store_id:this.ids,ids:id}})
        }
    }
}
</script>
<style lang="scss" scoped>
::v-deep .van-icon {
    color: #333333;
}

::v-deep .van-nav-bar__title {
    color: #333333;
}

::v-deep .van-nav-bar__arrow {
    font-size: 20px;
}

::v-deep .van-nav-bar__text {
    color: #333333;
}

.credit {
    padding-top: 46rpx;
    background: #F4F4F4;
    min-height: 100vh;

    .credit_list {
        .credit_item {
            width: 95%;
            height: 2.26rem;
            background-color: #fff;
            margin: 0 auto;
            border-radius: .24rem;
            margin-top: .2rem;
            padding: .32rem;
            box-sizing: border-box;

            .credit_info {
                display: flex;
                justify-content: space-between;
                font-family: PingFangSC, PingFang SC;
                font-weight: 500;
                line-height: .44rem;
                text-align: left;
                font-style: normal;
                .credit_name {
                    font-size: .32rem;
                    // color: #666666;

                }

                .credit_money {
                    font-size: .32rem;
                    color: #1D69E4;
                }
            }

            .line {
                width: 100%;
                height: .01rem;
                background-color: #E3E3E3;
                margin: .3rem 0;
            }

            .container {
                display: flex;
                justify-content: flex-end;

                /* 将内容对齐到右边 */
                .credit_btn {
                    border-radius: .3rem;
                    border: 1px solid #1D69E4;
                    display: inline-block;
                    font-family: PingFangSC, PingFang SC;
                    font-weight: 500;
                    font-size: .28rem;
                    color: #1D69E4;
                    // line-height: .4rem;
                    text-align: left;
                    font-style: normal;
                    padding: .1rem .2rem;
                }
            }

        }
    }
}
</style>